<template>
  <Layer :layer="layer">
    <el-row :gutter="20">
      <el-col :span="6">
        <Tree style="height:450px;border: 1px solid #eee;"></Tree>
      </el-col>
      <el-col :span="18">
        <Table></Table>
      </el-col>
    </el-row>

    <el-form :model="ruleForm" :rules="rules" ref="form" label-width="120px" style="margin-right: 30px">
    </el-form>
  </Layer>
</template>

<script lang="ts" setup>
import {ref, toRefs, reactive, onMounted, provide} from "vue";
import Layer from "@/components/layer/index.vue";
import Tree from "../resource/tree.vue";
import Table from "./my-table2.vue";
import {add, update} from "@/api/system/role";
import {ElMessage} from "element-plus";

const props = defineProps({
  layer: {
    type: Object,
    default() {
      return {
        show: false,
        title: "",
        showButton: true,
      };
    },
  },
});
let activeResource: any = ref({});
let activeRoleId: any = ref({});
provide("activeResource", activeResource);
provide("activeRoleId", activeRoleId);

const {layer} = toRefs(props);
const emits = defineEmits(["getTableData"]);
const form = ref();

let ruleForm = ref({
  status: 1,
});

const rules = {};

init();

function init() {
  // 用于判断新增还是编辑功能
  if (props.layer.row) {
    activeRoleId.value = props.layer.row.roleId
    ruleForm.value = JSON.parse(JSON.stringify(props.layer.row)); // 数量量少的直接使用这个转
  } else {
  }
}

</script>

<style lang="scss" scoped>
</style>